import {
  addComment,
  AddCommentRes,
  collectArticle,
  CommentRes,
  disCollectArticle,
  disLikeArticle,
  getArticleById,
  getArticles,
  getComment,
  likeArticle,
  TAticleRes,
  TAtilcle,
  TAtilcleInfo
} from '@/api/article'
import { createAsyncThunk, createSlice, PayloadAction } from '@reduxjs/toolkit'

// 获取文章推荐
export const getArticlesAction = createAsyncThunk(
  'article/getArticles',
  async (channel_id: number) => {
    try {
      const res = await getArticles(channel_id)
      const { pre_timestamp, results } = res.data.data
      return {
        channel_id,
        pre_timestamp,
        articles: results
      }
    } catch (error) {}
  }
)

// 获取文章详情
export const getArticleByIdAction = createAsyncThunk(
  'article/getArticleById',
  async (article_id: string, state) => {
    try {
      const res = await getArticleById(article_id)
      return res.data.data
    } catch (error) {}
  }
)

// 对文章点赞
export const likeArticleAction = createAsyncThunk(
  'article/likeArticle',
  async (article_id: string, state) => {
    try {
      await likeArticle(article_id)
      await state.dispatch(getArticleByIdAction(article_id))
    } catch (error) {}
  }
)
// 取消点赞
export const disLikeArticleAction = createAsyncThunk(
  'article/disLikeArticle',
  async (article_id: string, state) => {
    try {
      await disLikeArticle(article_id)
      await state.dispatch(getArticleByIdAction(article_id))
    } catch (error) {}
  }
)
// 收藏
export const collectArticleAction = createAsyncThunk(
  'article/collectArticle',
  async (article_id: string, state) => {
    try {
      await collectArticle(article_id)
      await state.dispatch(getArticleByIdAction(article_id))
    } catch (error) {}
  }
)
// 取消收藏
export const disCollectArticleAction = createAsyncThunk(
  'article/disCollectArticle',
  async (article_id: string, state) => {
    try {
      await disCollectArticle(article_id)
      await state.dispatch(getArticleByIdAction(article_id))
    } catch (error) {}
  }
)
// 获取评论
export const getArtCommentAction = createAsyncThunk(
  'article/getArtComment',
  async (source: string) => {
    try {
      const res = await getComment('a', source)
      return res.data.data
    } catch (error) {}
  }
)
// 获取评论的评论
export const getReCommentAction = createAsyncThunk(
  'article/getReComment',
  async (source: string) => {
    try {
      const res = await getComment('c', source)
      return res.data.data
    } catch (error) {}
  }
)
// 发表文章评论
export const addCommentAction = createAsyncThunk(
  'article/addComment',
  async (data: { target: string; content: string }) => {
    try {
      const res = await addComment(data.target, data.content)
      return res.data.data
    } catch (error) {}
  }
)
// 发表评论的评论
export const addReCommentAction = createAsyncThunk(
  'article/addReComment',
  async (data: { target: string; content: string }) => {
    try {
      const res = await addComment(data.target, data.content)
      return res.data.data
    } catch (error) {}
  }
)
export interface IArticle {
  channelAticles: {
    [key: number]: {
      pre_timestamp: TAticleRes['pre_timestamp']
      articles: TAtilcle[]
    }
  }
  articleInfo: TAtilcleInfo
  commentRes: CommentRes
  reCommentRes: CommentRes
}
const initialState: IArticle = {
  channelAticles: {},
  articleInfo: {} as TAtilcleInfo,
  commentRes: {} as CommentRes,
  reCommentRes: {} as CommentRes
}

export const articleSlice = createSlice({
  name: 'article',
  initialState,
  reducers: {},
  extraReducers: {
    // 发表评论成功
    [addCommentAction.fulfilled.type]: (
      state,
      action: PayloadAction<AddCommentRes>
    ) => {
      console.log(action, 'action')
      state.commentRes.results = [
        action.payload.new_obj,
        ...state.commentRes.results
      ]
    },
    // 发表评论的评论成功
    [addReCommentAction.fulfilled.type]: (
      state,
      action: PayloadAction<AddCommentRes>
    ) => {
      state.reCommentRes.results = [
        action.payload.new_obj,
        ...state.reCommentRes.results
      ]
    },
    // 获取文章推荐成功
    [getArticlesAction.fulfilled.type]: (
      state,
      action: PayloadAction<{
        channel_id: number
        pre_timestamp: TAticleRes['pre_timestamp']
        articles: TAtilcle[]
      }>
    ) => {
      const { channel_id, pre_timestamp, articles } = action.payload
      state.channelAticles[channel_id] = { pre_timestamp, articles }
    },
    // 获取详情成功
    [getArticleByIdAction.fulfilled.type]: (
      state,
      action: PayloadAction<TAtilcleInfo>
    ) => {
      state.articleInfo = action.payload
    },
    // 获取文章评论
    [getArtCommentAction.fulfilled.type]: (
      state,
      action: PayloadAction<CommentRes>
    ) => {
      console.log('action1', action)

      state.commentRes = action.payload
    },
    // 获取评论的评论
    [getReCommentAction.fulfilled.type]: (
      state,
      action: PayloadAction<CommentRes>
    ) => {
      console.log('action2',action);
      state.reCommentRes = action.payload
    }
  }
})
// Action creators are generated for each case reducer function
// export const {  } = articleSlice.actions

export default articleSlice.reducer
